<template>
	<view class="content">
<!--		<u-navbar bgColor='#4871C0' :titleStyle="{ color: '#FFF'}" title="签到二维码" leftIconColor="#FFF"-->
<!--			@rightClick="rightClick" :autoBack="true"  >-->
<!--		</u-navbar>-->
		<view class="qrcode">
			<img src="../../../static/img/qrcode.png" style="vertical-align: middle;margin-right: 2pt;"/>
			<span class="title-text">请参会者扫描此二维码</span>
			<view class="qr">
        <u-image :width="200" :height="200" :src="qr_url"></u-image>
      </view>
		</view>
		<view class="title">
			<span class="title-text">{{title}}</span>
		</view>
		<view style="text-align: center;color: #999999;font-size: 24rpx">
      长按保存二维码

<!--			<button type="primary" class="button" @click="downloadImg">长按保存二维码</button>-->
		</view>
		<view class="desc">
			<p>请使用微信/企业微信/政务微信扫码，使用方法如下 </p>
			<p>1、发起人通过手机展示，让参会人扫码 </p>
			<p>2、将二维码投屏至大屏幕，让参会人在屏幕扫码 </p>
			<p>3、打印二维码，贴在会议室门口，让参会人扫码</p>
		</view>
	</view>
</template>
<script>
import {qrcodeMeet} from "../../../api/meetApi";
export default {
  data() {
    return {
      id: '',
      qr_url: '',
	  title:'',
      isLoading:false
    };
  },
  onLoad(options) {
    this.id = options.id;
    this.getData();
  },
  onShow() {

  },
  methods: {

    getData() {
      this.isLoading = true;
      let params = {
        meet_id: this.id
      };
      qrcodeMeet(params).then(res => {
        this.isLoading = false;
        this.qr_url = res.data.qr_url;
        this.title = res.data.title;
      })
    },
    downloadImg(){
      // let params={
      // }
      // this.$store.dispatch('downloadImg',params)
    }
  }

};
</script>
<style scoped>
	.content {
		background-color: #F8F8F8;
		min-height: 100vh;

	}
	.qrcode{
		background-color: #FFF;
		margin: 45px 15px 10pt 15px;
		padding: 5pt;
		text-align: center;
	}
	.qr{
    display: flex;
    justify-content: center
	}
	.desc{
		margin-top: 15pt;
		margin-left: 15px;
		margin-right: 15px;

		padding: 10pt;
		background-color: #fff;
		font-size: 14px;
		color: #999999;
	}
	.button{
		background-color: #4871C0;
		margin: 0px 15px;
	}
	p{
		padding: 2pt;
	}
	.title-text{
		font-size: 18px;
		color: #333333;
		font-weight: 500;
	}
	.title{
		text-align: center;
		margin: 15pt 0pt;
	}

</style>
